<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<link type="text/css" rel="stylesheet" href="css/style.css" />
		<script type="text/javascript" src="js/jquery-1.8.2.min.js"></script>
		<script type="text/javascript" src="js/menu.js"></script>
		<script type="text/javascript" src="js/n_nav.js"></script>
		<script type="text/javascript" src="js/num.js">
			var jq = jQuery.noConflict();
		</script>
		<script type="text/javascript" src="js/shade.js"></script>
		<title>易买网购物车</title>
		<style type="text/css">
			.nullBuyCar {
				width: 100%;
				height: 200px;
				border: 1px solid orange;
				display: flex;
				align-items: center;
				justify-content: center;
				font-size: 30px;
				line-height: 40px;
			}
		</style>
	</head>
	<body>


		<div style=" ">
			<span style="font-size: 16px;">送货至:</span>
			省份：
			<select name="province" id="province">

			</select>
			城市：
			<select name="city" id="city">

			</select>
			区县：
			<select name="county" id="county">

			</select>


			<!--End 所在收货地区 End-->
			<span class="fr">
				<span class="fl">你好，<span id="getUsername" value="${user.username}">${user.username}</span> <a href="javascript:showCar()"></a>&nbsp;
					<a href="Regist.html" style="color:#ff4e00;">免费注册</a>&nbsp;|&nbsp;<a href="#">我的订单</a>&nbsp;|</span>
				<span class="ss">
					<div class="ss_list">
						<a href="#">收藏夹</a>
						<div class="ss_list_bg">
							<div class="s_city_t"></div>
							<div class="ss_list_c">
								<ul>
									<li><a href="#">我的收藏夹</a></li>
									<li><a href="#">我的收藏夹</a></li>
								</ul>
							</div>
						</div>
					</div>
					<div class="ss_list">
						<a href="#">客户服务</a>
						<div class="ss_list_bg">
							<div class="s_city_t"></div>
							<div class="ss_list_c">
								<ul>
									<li><a href="#">客户服务</a></li>
									<li><a href="#">客户服务</a></li>
									<li><a href="#">客户服务</a></li>
								</ul>
							</div>
						</div>
					</div>
					<div class="ss_list">
						<a href="#">网站导航</a>
						<div class="ss_list_bg">
							<div class="s_city_t"></div>
							<div class="ss_list_c">
								<ul>
									<li><a href="#">网站导航</a></li>
									<li><a href="#">网站导航</a></li>
								</ul>
							</div>
						</div>
					</div>
				</span>
				<span class="fl">|&nbsp;关注我们：</span>
				<span class="s_sh"><a href="#" class="sh1">新浪</a><a href="#" class="sh2">微信</a></span>
				<span class="fr">|&nbsp;<a href="#">手机版&nbsp;<img src="images/s_tel.png" align="absmiddle" /></a></span>
			</span>
		</div>
		<div class="top">
			<div class="logo"><a href="Index.html"><img src="images/logo.png" /></a></div>
			<div class="search">
				<form>
					<input type="text" value="" class="s_ipt" />
					<input type="submit" value="搜索" class="s_btn" />
				</form>
				<span class="fl"><a href="#">咖啡</a><a href="#">iphone 6S</a><a href="#">新鲜美食</a><a href="#">蛋糕</a><a href="#">日用品</a><a
					 href="#">连衣裙</a></span>
			</div>
			<div class="i_car">
				<div class="car_t">购物车 </div>
				<div class="car_bg">
					<!--Begin 购物车未登录 Begin-->
					<!--End 购物车未登录 End-->
					<!--Begin 购物车已登录 Begin-->
					<ul class="cars">
					</ul>
					<div class="price_sum">共计&nbsp; <font color="#ff4e00">￥</font><span id="allMoney"></span></div>
					<div class="price_a"><a href="BuyCar.jsp">去购物车结算</a></div>
					<!--End 购物车已登录 End-->
				</div>
			</div>
		</div>
		<!--End Header End-->
		<!--Begin Menu Begin-->
		<div class="menu_bg">
			<div class="menu">
				<!--Begin 商品分类详情 Begin-->
				<div class="nav">
					<div class="nav_t">全部商品分类</div>
					<div class="leftNav none">
						<ul>
							<li>
								<div class="fj">
									<span class="n_img"><span></span><img src="images/nav1.png" /></span>
									<span class="fl">进口食品、生鲜</span>
								</div>
								<div class="zj">
									<div class="zj_l">
										<div class="zj_l_c">
											<h2>零食 / 糖果 / 巧克力</h2>
											<a href="#">坚果</a>|<a href="#">蜜饯</a>|<a href="#">红枣</a>|<a href="#">牛肉干</a>|<a href="#">巧克力</a>|
											<a href="#">口香糖</a>|<a href="#">海苔</a>|<a href="#">鱼干</a>|<a href="#">蜜饯</a>|<a href="#">红枣</a>|
											<a href="#">蜜饯</a>|<a href="#">红枣</a>|<a href="#">牛肉干</a>|<a href="#">蜜饯</a>|
										</div>
										<div class="zj_l_c">
											<h2>零食 / 糖果 / 巧克力</h2>
											<a href="#">坚果</a>|<a href="#">蜜饯</a>|<a href="#">红枣</a>|<a href="#">牛肉干</a>|<a href="#">巧克力</a>|
											<a href="#">口香糖</a>|<a href="#">海苔</a>|<a href="#">鱼干</a>|<a href="#">蜜饯</a>|<a href="#">红枣</a>|
											<a href="#">蜜饯</a>|<a href="#">红枣</a>|<a href="#">牛肉干</a>|<a href="#">蜜饯</a>|
										</div>
										<div class="zj_l_c">
											<h2>零食 / 糖果 / 巧克力</h2>
											<a href="#">坚果</a>|<a href="#">蜜饯</a>|<a href="#">红枣</a>|<a href="#">牛肉干</a>|<a href="#">巧克力</a>|
											<a href="#">口香糖</a>|<a href="#">海苔</a>|<a href="#">鱼干</a>|<a href="#">蜜饯</a>|<a href="#">红枣</a>|
											<a href="#">蜜饯</a>|<a href="#">红枣</a>|<a href="#">牛肉干</a>|<a href="#">蜜饯</a>|
										</div>
										<div class="zj_l_c">
											<h2>零食 / 糖果 / 巧克力</h2>
											<a href="#">坚果</a>|<a href="#">蜜饯</a>|<a href="#">红枣</a>|<a href="#">牛肉干</a>|<a href="#">巧克力</a>|
											<a href="#">口香糖</a>|<a href="#">海苔</a>|<a href="#">鱼干</a>|<a href="#">蜜饯</a>|<a href="#">红枣</a>|
											<a href="#">蜜饯</a>|<a href="#">红枣</a>|<a href="#">牛肉干</a>|<a href="#">蜜饯</a>|
										</div>
										<div class="zj_l_c">
											<h2>零食 / 糖果 / 巧克力</h2>
											<a href="#">坚果</a>|<a href="#">蜜饯</a>|<a href="#">红枣</a>|<a href="#">牛肉干</a>|<a href="#">巧克力</a>|
											<a href="#">口香糖</a>|<a href="#">海苔</a>|<a href="#">鱼干</a>|<a href="#">蜜饯</a>|<a href="#">红枣</a>|
											<a href="#">蜜饯</a>|<a href="#">红枣</a>|<a href="#">牛肉干</a>|<a href="#">蜜饯</a>|
										</div>
										<div class="zj_l_c">
											<h2>零食 / 糖果 / 巧克力</h2>
											<a href="#">坚果</a>|<a href="#">蜜饯</a>|<a href="#">红枣</a>|<a href="#">牛肉干</a>|<a href="#">巧克力</a>|
											<a href="#">口香糖</a>|<a href="#">海苔</a>|<a href="#">鱼干</a>|<a href="#">蜜饯</a>|<a href="#">红枣</a>|
											<a href="#">蜜饯</a>|<a href="#">红枣</a>|<a href="#">牛肉干</a>|<a href="#">蜜饯</a>|
										</div>
									</div>
									<div class="zj_r">
										<a href="#"><img src="images/n_img1.jpg" width="236" height="200" /></a>
										<a href="#"><img src="images/n_img2.jpg" width="236" height="200" /></a>
									</div>
								</div>
							</li>
							<li>
								<div class="fj">
									<span class="n_img"><span></span><img src="images/nav2.png" /></span>
									<span class="fl">食品、饮料、酒</span>
								</div>
								<div class="zj" style="top:-40px;">
									<div class="zj_l">
										<div class="zj_l_c">
											<h2>零食 / 糖果 / 巧克力2</h2>
											<a href="#">坚果</a>|<a href="#">蜜饯</a>|<a href="#">红枣</a>|<a href="#">牛肉干</a>|<a href="#">巧克力</a>|
											<a href="#">口香糖</a>|<a href="#">海苔</a>|<a href="#">鱼干</a>|<a href="#">蜜饯</a>|<a href="#">红枣</a>|
											<a href="#">蜜饯</a>|<a href="#">红枣</a>|<a href="#">牛肉干</a>|<a href="#">蜜饯</a>|
										</div>
										<div class="zj_l_c">
											<h2>零食 / 糖果 / 巧克力</h2>
											<a href="#">坚果</a>|<a href="#">蜜饯</a>|<a href="#">红枣</a>|<a href="#">牛肉干</a>|<a href="#">巧克力</a>|
											<a href="#">口香糖</a>|<a href="#">海苔</a>|<a href="#">鱼干</a>|<a href="#">蜜饯</a>|<a href="#">红枣</a>|
											<a href="#">蜜饯</a>|<a href="#">红枣</a>|<a href="#">牛肉干</a>|<a href="#">蜜饯</a>|
										</div>
									</div>
									<div class="zj_r">
										<a href="#"><img src="images/n_img1.jpg" width="236" height="200" /></a>
										<a href="#"><img src="images/n_img2.jpg" width="236" height="200" /></a>
									</div>
								</div>
							</li>
							<li>
								<div class="fj">
									<span class="n_img"><span></span><img src="images/nav3.png" /></span>
									<span class="fl">母婴、玩具、童装</span>
								</div>
								<div class="zj" style="top:-80px;">
									<div class="zj_l">
										<div class="zj_l_c">
											<h2>零食 / 糖果 / 巧克力3</h2>
											<a href="#">坚果</a>|<a href="#">蜜饯</a>|<a href="#">红枣</a>|<a href="#">牛肉干</a>|<a href="#">巧克力</a>|
											<a href="#">口香糖</a>|<a href="#">海苔</a>|<a href="#">鱼干</a>|<a href="#">蜜饯</a>|<a href="#">红枣</a>|
											<a href="#">蜜饯</a>|<a href="#">红枣</a>|<a href="#">牛肉干</a>|<a href="#">蜜饯</a>|
										</div>
									</div>
									<div class="zj_r">
										<a href="#"><img src="images/n_img1.jpg" width="236" height="200" /></a>
										<a href="#"><img src="images/n_img2.jpg" width="236" height="200" /></a>
									</div>
								</div>
							</li>
							<li>
								<div class="fj">
									<span class="n_img"><span></span><img src="images/nav4.png" /></span>
									<span class="fl">家居、家庭清洁、纸品</span>
								</div>
								<div class="zj" style="top:-120px;">
									<div class="zj_l">
										<div class="zj_l_c">
											<h2>零食 / 糖果 / 巧克力4</h2>
											<a href="#">坚果</a>|<a href="#">蜜饯</a>|<a href="#">红枣</a>|<a href="#">牛肉干</a>|<a href="#">巧克力</a>|
											<a href="#">口香糖</a>|<a href="#">海苔</a>|<a href="#">鱼干</a>|<a href="#">蜜饯</a>|<a href="#">红枣</a>|
											<a href="#">蜜饯</a>|<a href="#">红枣</a>|<a href="#">牛肉干</a>|<a href="#">蜜饯</a>|
										</div>
									</div>
									<div class="zj_r">
										<a href="#"><img src="images/n_img1.jpg" width="236" height="200" /></a>
										<a href="#"><img src="images/n_img2.jpg" width="236" height="200" /></a>
									</div>
								</div>
							</li>
							<li>
								<div class="fj">
									<span class="n_img"><span></span><img src="images/nav5.png" /></span>
									<span class="fl">美妆、个人护理、洗护</span>
								</div>
								<div class="zj" style="top:-160px;">
									<div class="zj_l">
										<div class="zj_l_c">
											<h2>零食 / 糖果 / 巧克力5</h2>
											<a href="#">坚果</a>|<a href="#">蜜饯</a>|<a href="#">红枣</a>|<a href="#">牛肉干</a>|<a href="#">巧克力</a>|
											<a href="#">口香糖</a>|<a href="#">海苔</a>|<a href="#">鱼干</a>|<a href="#">蜜饯</a>|<a href="#">红枣</a>|
											<a href="#">蜜饯</a>|<a href="#">红枣</a>|<a href="#">牛肉干</a>|<a href="#">蜜饯</a>|
										</div>
									</div>
									<div class="zj_r">
										<a href="#"><img src="images/n_img1.jpg" width="236" height="200" /></a>
										<a href="#"><img src="images/n_img2.jpg" width="236" height="200" /></a>
									</div>
								</div>
							</li>
							<li>
								<div class="fj">
									<span class="n_img"><span></span><img src="images/nav6.png" /></span>
									<span class="fl">女装、内衣、中老年</span>
								</div>
								<div class="zj" style="top:-200px;">
									<div class="zj_l">
										<div class="zj_l_c">
											<h2>零食 / 糖果 / 巧克力6</h2>
											<a href="#">坚果</a>|<a href="#">蜜饯</a>|<a href="#">红枣</a>|<a href="#">牛肉干</a>|<a href="#">巧克力</a>|
											<a href="#">口香糖</a>|<a href="#">海苔</a>|<a href="#">鱼干</a>|<a href="#">蜜饯</a>|<a href="#">红枣</a>|
											<a href="#">蜜饯</a>|<a href="#">红枣</a>|<a href="#">牛肉干</a>|<a href="#">蜜饯</a>|
										</div>
									</div>
									<div class="zj_r">
										<a href="#"><img src="images/n_img1.jpg" width="236" height="200" /></a>
										<a href="#"><img src="images/n_img2.jpg" width="236" height="200" /></a>
									</div>
								</div>
							</li>
							<li>
								<div class="fj">
									<span class="n_img"><span></span><img src="images/nav7.png" /></span>
									<span class="fl">鞋靴、箱包、腕表配饰</span>
								</div>
								<div class="zj" style="top:-240px;">
									<div class="zj_l">
										<div class="zj_l_c">
											<h2>零食 / 糖果 / 巧克力7</h2>
											<a href="#">坚果</a>|<a href="#">蜜饯</a>|<a href="#">红枣</a>|<a href="#">牛肉干</a>|<a href="#">巧克力</a>|
											<a href="#">口香糖</a>|<a href="#">海苔</a>|<a href="#">鱼干</a>|<a href="#">蜜饯</a>|<a href="#">红枣</a>|
											<a href="#">蜜饯</a>|<a href="#">红枣</a>|<a href="#">牛肉干</a>|<a href="#">蜜饯</a>|
										</div>
									</div>
									<div class="zj_r">
										<a href="#"><img src="images/n_img1.jpg" width="236" height="200" /></a>
										<a href="#"><img src="images/n_img2.jpg" width="236" height="200" /></a>
									</div>
								</div>
							</li>
							<li>
								<div class="fj">
									<span class="n_img"><span></span><img src="images/nav8.png" /></span>
									<span class="fl">男装、运动</span>
								</div>
								<div class="zj" style="top:-280px;">
									<div class="zj_l">
										<div class="zj_l_c">
											<h2>零食 / 糖果 / 巧克力8</h2>
											<a href="#">坚果</a>|<a href="#">蜜饯</a>|<a href="#">红枣</a>|<a href="#">牛肉干</a>|<a href="#">巧克力</a>|
											<a href="#">口香糖</a>|<a href="#">海苔</a>|<a href="#">鱼干</a>|<a href="#">蜜饯</a>|<a href="#">红枣</a>|
											<a href="#">蜜饯</a>|<a href="#">红枣</a>|<a href="#">牛肉干</a>|<a href="#">蜜饯</a>|
										</div>
									</div>
									<div class="zj_r">
										<a href="#"><img src="images/n_img1.jpg" width="236" height="200" /></a>
										<a href="#"><img src="images/n_img2.jpg" width="236" height="200" /></a>
									</div>
								</div>
							</li>
							<li>
								<div class="fj">
									<span class="n_img"><span></span><img src="images/nav9.png" /></span>
									<span class="fl">手机、小家电、电脑</span>
								</div>
								<div class="zj" style="top:-320px;">
									<div class="zj_l">
										<div class="zj_l_c">
											<h2>零食 / 糖果 / 巧克力9</h2>
											<a href="#">坚果</a>|<a href="#">蜜饯</a>|<a href="#">红枣</a>|<a href="#">牛肉干</a>|<a href="#">巧克力</a>|
											<a href="#">口香糖</a>|<a href="#">海苔</a>|<a href="#">鱼干</a>|<a href="#">蜜饯</a>|<a href="#">红枣</a>|
											<a href="#">蜜饯</a>|<a href="#">红枣</a>|<a href="#">牛肉干</a>|<a href="#">蜜饯</a>|
										</div>
									</div>
									<div class="zj_r">
										<a href="#"><img src="images/n_img1.jpg" width="236" height="200" /></a>
										<a href="#"><img src="images/n_img2.jpg" width="236" height="200" /></a>
									</div>
								</div>
							</li>
							<li>
								<div class="fj">
									<span class="n_img"><span></span><img src="images/nav10.png" /></span>
									<span class="fl">礼品、充值</span>
								</div>
								<div class="zj" style="top:-360px;">
									<div class="zj_l">
										<div class="zj_l_c">
											<h2>零食 / 糖果 / 巧克力10</h2>
											<a href="#">坚果</a>|<a href="#">蜜饯</a>|<a href="#">红枣</a>|<a href="#">牛肉干</a>|<a href="#">巧克力</a>|
											<a href="#">口香糖</a>|<a href="#">海苔</a>|<a href="#">鱼干</a>|<a href="#">蜜饯</a>|<a href="#">红枣</a>|
											<a href="#">蜜饯</a>|<a href="#">红枣</a>|<a href="#">牛肉干</a>|<a href="#">蜜饯</a>|
										</div>
									</div>
									<div class="zj_r">
										<a href="#"><img src="images/n_img1.jpg" width="236" height="200" /></a>
										<a href="#"><img src="images/n_img2.jpg" width="236" height="200" /></a>
									</div>
								</div>
							</li>
						</ul>
					</div>
				</div>
				<!--End 商品分类详情 End-->
				<ul class="menu_r">
					<li><a href="Index.html">首页</a></li>
					<li><a href="Food.html">美食</a></li>
					<li><a href="Fresh.html">生鲜</a></li>
					<li><a href="HomeDecoration.html">家居</a></li>
					<li><a href="SuitDress.html">女装</a></li>
					<li><a href="MakeUp.html">美妆</a></li>
					<li><a href="Digital.html">数码</a></li>
					<li><a href="GroupBuying.html">团购</a></li>
				</ul>
				<div class="m_ad">中秋送好礼！</div>
			</div>
		</div>
		<!--End Menu End-->
		<div class="i_bg">
			<div class="content mar_20">
				<img src="images/img1.jpg" />
			</div>

			<!--Begin 第一步：查看购物车 Begin -->
			<div class="content mar_20">
				<table border="0" class="car_tab" style="width:1200px; margin-bottom:50px;display: none;" cellspacing="0"
				 cellpadding="0" id="buyCar">
					<tr>
						<td class="car_th" width="300">商品名称</td>
						<td class="car_th" width="140">商品型号</td>
						<td class="car_th" width="140">属性</td>
						<td class="car_th" width="140">单价</td>
						<td class="car_th" width="150">购买数量</td>
						<td class="car_th" width="130">小计</td>
						<td class="car_th" width="140">返还积分</td>
						<td class="car_th" width="150">操作</td>
					</tr>


					<tr>
						<td> 商品总价:<span id="totalPrice" style="font-family: 'Microsoft YaHei';"></span></td>
					</tr>
					<tr valign="top" height="150">
						<td colspan="6" align="right">
							<a href="Index.html"><img src="images/buy1.gif" /></a>&nbsp; &nbsp; <a href="BuyCar_Two.html"><img src="images/buy2.gif" /></a>
						</td>
					</tr>

				</table>
				<div class="nullBuyCar">
					<span>购物车空空如也~
					<br />
					赶紧去<a href="Index.jsp" style="color: orange;">添加商品</a>吧！
					</span>
				</div>
			</div>
			<!--End 第一步：查看购物车 End-->


			<!--Begin 弹出层-删除商品 Begin-->
			<div id="fade" class="black_overlay"></div>
			<div id="MyDiv" class="white_content">
				<div class="white_d">
					<div class="notice_t">
						<span class="fr" style="margin-top:10px; cursor:pointer;" onclick="CloseDiv('MyDiv','fade')"><img src="images/close.gif" /></span>
					</div>
					<div class="notice_c">

						<table border="0" align="center" style="font-size:16px;" cellspacing="0" cellpadding="0">
							<tr valign="top">
								<td>您确定要把该商品移除购物车吗？</td>
							</tr>
							<tr height="50" valign="bottom">
								<td><a href="#" class="b_sure">确定</a><a href="#" class="b_buy">取消</a></td>
							</tr>
						</table>

					</div>
				</div>
			</div>
			<!--End 弹出层-删除商品 End-->


			<!--Begin Footer Begin -->
			<div class="b_btm_bg bg_color">
				<div class="b_btm">
					<table border="0" style="width:210px; height:62px; float:left; margin-left:75px; margin-top:30px;" cellspacing="0"
					 cellpadding="0">
						<tr>
							<td width="72"><img src="images/b1.png" width="62" height="62" /></td>
							<td>
								<h2>正品保障</h2>正品行货 放心购买
							</td>
						</tr>
					</table>
					<table border="0" style="width:210px; height:62px; float:left; margin-left:75px; margin-top:30px;" cellspacing="0"
					 cellpadding="0">
						<tr>
							<td width="72"><img src="images/b2.png" width="62" height="62" /></td>
							<td>
								<h2>满38包邮</h2>满38包邮 免运费
							</td>
						</tr>
					</table>
					<table border="0" style="width:210px; height:62px; float:left; margin-left:75px; margin-top:30px;" cellspacing="0"
					 cellpadding="0">
						<tr>
							<td width="72"><img src="images/b3.png" width="62" height="62" /></td>
							<td>
								<h2>天天低价</h2>天天低价 畅选无忧
							</td>
						</tr>
					</table>
					<table border="0" style="width:210px; height:62px; float:left; margin-left:75px; margin-top:30px;" cellspacing="0"
					 cellpadding="0">
						<tr>
							<td width="72"><img src="images/b4.png" width="62" height="62" /></td>
							<td>
								<h2>准时送达</h2>收货时间由你做主
							</td>
						</tr>
					</table>
				</div>
			</div>
			<div class="b_nav">
				<dl>
					<dt><a href="#">新手上路</a></dt>
					<dd><a href="#">售后流程</a></dd>
					<dd><a href="#">购物流程</a></dd>
					<dd><a href="#">订购方式</a></dd>
					<dd><a href="#">隐私声明</a></dd>
					<dd><a href="#">推荐分享说明</a></dd>
				</dl>
				<dl>
					<dt><a href="#">配送与支付</a></dt>
					<dd><a href="#">货到付款区域</a></dd>
					<dd><a href="#">配送支付查询</a></dd>
					<dd><a href="#">支付方式说明</a></dd>
				</dl>
				<dl>
					<dt><a href="#">会员中心</a></dt>
					<dd><a href="#">资金管理</a></dd>
					<dd><a href="#">我的收藏</a></dd>
					<dd><a href="#">我的订单</a></dd>
				</dl>
				<dl>
					<dt><a href="#">服务保证</a></dt>
					<dd><a href="#">退换货原则</a></dd>
					<dd><a href="#">售后服务保证</a></dd>
					<dd><a href="#">产品质量保证</a></dd>
				</dl>
				<dl>
					<dt><a href="#">联系我们</a></dt>
					<dd><a href="#">网站故障报告</a></dd>
					<dd><a href="#">购物咨询</a></dd>
					<dd><a href="#">投诉与建议</a></dd>
				</dl>
				<div class="b_tel_bg">
					<a href="#" class="b_sh1">新浪微博</a>
					<a href="#" class="b_sh2">腾讯微博</a>
					<p>
						服务热线：<br />
						<span>400-123-4567</span>
					</p>
				</div>
				<div class="b_er">
					<div class="b_er_c"><img src="images/er.gif" width="118" height="118" /></div>
					<img src="images/ss.png" />
				</div>
			</div>
			<div class="btmbg">
				<div class="btm">
					备案/许可证编号：蜀ICP备12009302号-1-www.dingguagua.com Copyright © 2015-2018 尤洪商城网 All Rights Reserved. 复制必究 ,
					Technical Support: Dgg Group <br />
					<img src="images/b_1.gif" width="98" height="33" /><img src="images/b_2.gif" width="98" height="33" /><img src="images/b_3.gif"
					 width="98" height="33" /><img src="images/b_4.gif" width="98" height="33" /><img src="images/b_5.gif" width="98"
					 height="33" /><img src="images/b_6.gif" width="98" height="33" />
				</div>
			</div>
			<!--End Footer End -->
		</div>
		<script type="text/javascript" src="js/jquery-1.8.2.min.js"></script>
		<script type="text/javascript">
			$(function() {
				showCar();
				bind_pro();
				// totalConsume();
				//绑定change事件
				$("#province").change(function() {
					//获取当前省份的ID
					var proId = $("#province option:selected").val();
					//将之前的过时信息删除
					$("#city").children().remove();
					//根据当前省份ID去获取对应城市的信息
					bind_city(proId);

				})
				$("#city").change(function() {
					//获取当前省份的ID
					var proId = $("#province option:selected").val();
					//获取当前城市的id
					var cityId = $("#city option:selected").val();
					//删除之前的过时信息
					$("#county").children().remove();
					//根据当前城市去获取对应县区的信息
					bind_county(cityId);
				})

				$("#totalPrice").innerText = totalConsume;
			})

			function bind_pro() {

				$.getJSON(
					"ProvinceServlet",
					null,
					function(data) {
						//遍历data数据并且创建对应的option
						$(data).each(function(index, ob) {
							var proID = ob.id;
							var name = ob.name;
							//创建option
							var option = "<option value='" + proID + "'>" + name + "</option>";
							$("#province").append(option);
						})
						//在所有的option前面添加一个默认选项
						$("#province option:first").before("<option value='-1' selected='selected'>请选择省份</option>");

					}
				)
			}

			function bind_city(proId) {
				$.getJSON(
					"CityServlet", {
						"proId": proId
					},
					function(data) {
						//遍历data数据并且创建对应的option
						$(data).each(function(index, ob) {
							var cityID = ob.id;
							var name = ob.name;
							//创建option
							var option = "<option value='" + cityID + "'>" + name + "</option>";
							$("#city").append(option);
						})
						//在所有的option前面添加一个默认选项
						$("#city option:first").before("<option value='-1' selected='selected'>请选择城市</option>");
					}
				)
			}

			function bind_county(cityId) {
				$.getJSON(
					"CountyServlet", {
						"cityId": cityId
					},
					function(data) {
						//遍历data数据并且创建对应的option
						$(data).each(function(index, ob) {
							var countyId = ob.id;
							var name = ob.name;
							//创建option
							var option = "<option value='" + countyId + "'>" + name + "</option>";
							$("#county").append(option);
						})
						//在所有的option前面添加一个默认选项
						$("#county option:first").before("<option value='-1' selected='selected'>请选择区县</option>");
					}
				)
			}

			//写出商品的总价格
			var totalConsume = 0;

			//这个方法用于展示已经登录的用户的购物车详细内容
			function showCar() {

				//获取隐藏的input标签
				var username = $("#getUsername").val();
				alert(username);
				$.getJSON(
					"DoOrderCarServlet", {
						"username": username
					},
					function(data) {
						//遍历传回的数据并且创建对应的tr标签
						$(data).each(function(index, ob) {
							if (data == null) {
								$("#buyCar").css("display:none");
							}else{
								$(".nullBuyCar").css("display:none");
								var tr = "<tr><td align='center'>" +
									"<div class='c_s_img' ><img src=" + ob.product_Info.product_Pic_Info.pic_url +
									" width='73' height='73' style='vertical-align:middle;' /><span>" + ob.product_Info.product_name +
									"</span></div></td>" +
									"<td align='center' >" + ob.model_id + "</td>" +
									"<td align='center' >颜色：" + ob.product_Info.color_type + "</td>" +
									"<td align='center'>" + ob.price + "</td>" +
									"<td align='center'>" +
									"<div class='c_num'>" +
									"<input type='button' value='-' onclick='decrease(this);' class='car_btn_1'/>" +
									"<input type='text' value='" + ob.product_amount + "' name='' class='car_ipt'/>" +
									"<input type='button' value='+' onclick='increase(this);' class='car_btn_2'/>" +
									"</div>" +
									"</td>" +
									"<td align='center' style='color:#ff4e00;' >" + ob.price * ob.product_amount + "</td>" +
									"<td align='center'>" + ob.price * ob.product_amount / 10 + "</td>" +
									"<td align='center'><input type='button' value='删除' onclick='drop(this);'/><input type='button' onclick='javascript:forCollection(this)' value='加入收藏'  /></td>" +
									"</tr>";
								
								var l =
									"<div class='img'><a href='#'><img src=" + ob.product_Info.product_Pic_Info.pic_url +
									" width='58' height='58' /></a></div>" +
									"<div class='name'><a href='#'>" + ob.product_Info.product_name + "</a></div>" +
									"<div class='price'>" +
									"<font color=#ff4e00>" + ob.price + "</font>&nbsp;X" + ob.product_amount +
									"</div>";
								var li = document.createElement('li');
								li.innerHTML = l;
								totalConsume += ob.price * ob.product_amount;
								document.getElementById("totalPrice").innerHTML = totalConsume;
								document.getElementById("allMoney").innerHTML = totalConsume;
								var cars = document.getElementsByClassName("cars")[0];
								$("table tr:eq(0)").after(tr);
								cars.appendChild(li);
							}
							
						})

					}
				)
			}

			/* 此方法用于计算购物车总金额 */
			function sumConsume() {
				//获得购物车中所有的行数
				var buyCar = document.getElementById("buyCar");
				//获得所有的tr标签
				var trs = buyCar.getElementsByTagName("tr");
				//定义初始的总金额
				var totalConusmes = 0;
				//遍历所有的tr标签(除去标题标签和后面占用的两个标签)
				for (var i = 1; i < trs.length - 2; i++) {
					//获取每一行tr标签中第五行数据(小计金额)
					var td = trs[i].getElementsByTagName("td")[5].innerText;
					totalConusmes += parseFloat(td);
				};
				var sum = document.getElementById("totalPrice");
				sum.innerText = totalConusmes;
				document.getElementById("allMoney").innerHTML = totalConusmes;
			};

			//当前的购买数量
			var amount;
			//当前的商品名称
			var pName;
			//当前的商品型号
			var mId;
			var uname = document.getElementById('getUsername').innerText;

			function increase(btn) {
				//获取按钮的父亲(获取到c_num的div节点)
				var td2 = btn.parentNode;
				//获取当前指向的tr标签
				var allTr = td2.parentNode.parentNode;
				//获取当前指向的tr中属性为单价的td中的内容
				var currentPrice = allTr.childNodes[3].innerText;
				//获取td2内的文本框(div的第二个input标签)
				var text = td2.getElementsByTagName("input")[1];
				//获取文本框内值+1后写回文本框
				amount = text.value;
				//获取商品名称
				pName = allTr.firstChild.firstChild.lastChild.innerText;
				//获取当前的型号
				mId = allTr.childNodes[1].innerText;
				//将数据传回后端,判断此时的数量是否合法
				if (estimateCurrentAmount(parseInt(amount) + 1, pName, mId, uname) == true) {
					//回写当第二个标签中
					text.value = ++amount;
				};
				var sumPriceTd = allTr.getElementsByTagName("td")[5];
				//设置内容为单价乘以数量
				sumPriceTd.innerText = parseFloat(currentPrice) * amount;
				//将积分的标签内容修改为小计价格除以10
				var returnPointTd = allTr.childNodes[6];
				returnPointTd.innerText = sumPriceTd.innerText / 10;
				//点击的时候修改当前的总金额
				sumConsume();
			};

			//判断当前的数量是否合法
			function estimateCurrentAmount(amount, pName, mId, uname) {
				var flag = false;
				$.ajaxSettings.async = false;
				$.getJSON(
					"EstimateCurrentAmountServlet", {
						"amount": amount,
						"pName": pName,
						"mId": mId,
						"uname": uname
					},
					function(data) {
						if (data == true) {
							$(".car_btn_2").removeAttr('disabled');
							flag = true;
						} else {
							$(".car_btn_2").attr("disabled", "disabled");
						}
					}
				);
				return flag;
			};

			//减法 数量不能小于1 =================================================
			function decrease(btn) {
				$(".car_btn_2").removeAttr('disabled');
				//获取按钮的父亲(获取到c_num的div节点)
				var td2 = btn.parentNode;
				//获取当前指向的tr标签
				var allTr = td2.parentNode.parentNode;
				//获取当前指向的tr中属性为单价的td中的内容
				var currentPrice = allTr.childNodes[3].innerText;
				//获取td2内的文本框(div的第二个input标签)
				var text = td2.getElementsByTagName("input")[1];
				pName = allTr.firstChild.firstChild.lastChild.innerText;
				mId = allTr.childNodes[1].innerText;
				//获取文本框内值+1后写回文本框
				var amount = text.value;
				//回写当第二个标签中
				// text.value = --amount;
				if (amount <= 1) {
					text.value = 1;
				}
				if (estimateCurrentAmount(parseInt(amount) - 1, pName, mId, uname) == true && amount > 1) {
					//回写当第二个标签中
					text.value = --amount;
				}

				var sumPriceTd = allTr.getElementsByTagName("td")[5];
				//设置内容为单价乘以数量
				sumPriceTd.innerText = parseFloat(currentPrice) * amount;
				//将积分的标签内容修改为小计价格除以10
				var returnPointTd = allTr.childNodes[6];
				returnPointTd.innerText = sumPriceTd.innerText / 10;
				sumConsume();
			};

			//删除tr行,而不是删除tr行中所有td====================
			function drop(btn) {
				var userChoose = confirm("确定删除吗?");
				if (userChoose) {
					var uname = document.getElementById('getUsername').innerText;
					var currentCount = document.getElementsByClassName("car_ipt")[0].value;
					var table = btn.parentNode.parentNode.parentNode;
					//获取当前的tr标签
					var tr = btn.parentNode.parentNode;
					//获取当前的商品名称和商品型号
					var currentName = tr.childNodes[0].innerText;
					var modle_id = tr.childNodes[1].innerText;
					$.getJSON(
						"RemoveCarOrderServlet", {
							"currentName": currentName,
							"modle_id": modle_id,
							"uname": uname,
							"currentCount": currentCount
						},
						function(data) {
							//后端传入的是数字1
							if (data == "1") {
								table.removeChild(tr);
							} else {
								alert("删除失败");
							}
						}
					)
					sumConsume();
				}
			};

			//加入收藏的方法(方法还需修改)
			function forCollection(col) {
				//获取当前收藏人的姓名
				var name = document.getElementById('getUsername').innerText;
				var tr = col.parentNode.parentNode;
				//获取当前的商品名称和商品型号
				var currentName = tr.childNodes[0].innerText;
				var modle_id = tr.childNodes[1].innerText;
				var price = tr.childNodes[3].innerText;
				$.getJSON(
					"CollectionServlet", {
						"name": name,
						"currentName": currentName,
						"modle_id": modle_id,
						"price": price
					},
					function(data) {
						if (data == "1") {
							alert("收藏成功");
						} else {
							alert("收藏失败");
						}
					}
				)

			};
		</script>
	</body>


	<!--[if IE 6]>
<script src="//letskillie6.googlecode.com/svn/trunk/2/zh_CN.js"></script>
<![endif]-->
</html>
